<!--成员业绩-->

<ion-header>
    <ion-toolbar content-page class="fir-toolbar">
        <ion-buttons start>
            <button ion-button icon-only (click)="backButtonClick($event)">
                <i class="toolbar-back"></i>
            </button>
        </ion-buttons>
        <ion-title>{{title}}</ion-title>
        <ion-buttons end>
            <button ion-button icon-only adpmenutoggle>
                <i class="toolbar-menu"></i>
            </button>
        </ion-buttons>
    </ion-toolbar>
</ion-header>

<ion-content>
    <div class="group-group">
        <div class="group-time">
            <div class="time-filter">
                <div class="info-head">
                    <span>时间范围</span>
                    <span class="timeFilter">
                      <span>{{startFilterDate.replace('-','/')}}</span>
                      <span class="line">—</span>
                      <span>{{endFilterDate.replace('-','/')}}</span>
                    </span>
                </div>
            </div>
        </div>
        <ion-grid class="group-header">
            <ion-row>
                <ion-col col-2 text-center style="width: 20%;max-width: 20%;flex: 0 0 20%">
                    营销员
                </ion-col>
                <!--<ion-col col-2 text-center style="width: 12%;max-width: 12%;flex: 0 0 12%">-->
                    <!--职级-->
                <!--</ion-col>-->
                <ion-col col-2 text-center>
                    3MO
                </ion-col>
                <ion-col col-2 text-center>
                    有效<br>人力
                </ion-col>
                <ion-col col-3 text-center>
                    总净PC
                </ion-col>
                <ion-col col-3 text-center>
                    总净APE
                </ion-col>
            </ion-row>
        </ion-grid>
        <div class="no-data" *ngIf="(!groupList || groupList.length === 0) && isLoaded">
            <div class="no-data-img"><img src="./assets/images/common/icon_nodata.png"></div>
            <div class="no-data-txt">没有相关数据</div>
        </div>
        <ion-grid>
            <div *ngIf="groupList&&groupList.length">
                <ion-row [ngClass]="{'isActive':(item.isActive == 0)}" class="group-item" *ngFor="let item of groupList" (click)="goToMemberDetail(item)">
                    <ion-col col-2 text-center style="width: 20%;max-width: 20%;flex:0 0 20%">
                        <ion-label class="agent-code">
                            {{item.agentName}}
                        </ion-label>
                    </ion-col>
                    <!--<ion-col col-2 text-center style="width: 12%;max-width: 12%;flex: 0 0 12%">-->
                        <!--<ion-label>-->
                            <!--{{item.agentLevel}}-->
                        <!--</ion-label>-->
                    <!--</ion-col>-->
                    <ion-col col-2 text-center>
                        <ion-label>
                            {{item.threeMo}}
                        </ion-label>
                    </ion-col>
                    <ion-col col-2 text-center>
                        <ion-label>
                            {{item.isEffective == 1?'Y':'N'}}
                        </ion-label>
                    </ion-col>
                    <ion-col col-3 text-center>
                        <ion-label>
                            {{item.totalPC?(item.totalPC|number:'1.0-2'):'-'}}
                        </ion-label>
                    </ion-col>
                    <ion-col col-3 text-center>
                        <ion-label>
                            {{item.totalAPE?(item.totalAPE|number:'1.0-2'):'-'}}
                        </ion-label>
                    </ion-col>
                </ion-row>
            </div>
        </ion-grid>
    </div>
    <ion-fab bottom right class="go-up">
        <button ion-fab (click)="goUp()" color="light">
            <img class="go-up-icon" src="./assets/images/client/client-list/icon_top.png" alt="">
        </button>
    </ion-fab>
</ion-content>
